<div id="container" style="height: 50%">
    <script type="text/javascript">

        var dom = document.getElementById("container");
        var myChart = echarts.init(dom);
        var app = {};

        var option;
        option = {
            title: {
                text: ''
            },
            tooltip: {},
            legend: {
                data: ['你的阅读分布', '平均阅读分布']
            },
            radar: {
                // shape: 'circle',
                name: {
                    textStyle: {
                        color: '#fff',
                        backgroundColor: '#999',
                        borderRadius: 3,
                        padding: [3, 5]
                    }
                },
                indicator: [
                    {% for cur_name in genre_name %}
            {
            name: "{{ cur_name|safe }}", max: {{ radar_scale|safe }}},
            {% endfor %}
        ]
        },
        series: [{
            name: 'Yours vs Average',
            type: 'radar',
            // areaStyle: {normal: {}},
            data: [
                {
                    value: [
                        {% for cur_cnt in genre_cnt %}
                    {{ cur_cnt| safe }},
        {% endfor %}
        ],
            name: '你的阅读分布'
            },
        {
            value: [0, 0, 0, 0, 0, 0],
                name: '平均阅读分布'
        }
        ]
    }]
};

        if (option && typeof option === 'object') {
            myChart.setOption(option);
        }

    </script>
</div>